<template lang="html">
  <div class="line2">
    <div class="artLine2">
      <p><img src="../../static/imgs/shu2.png" alt="">航班信息<i>{{obj5.label}}</i></p>
      <div v-for="item of obj5.go">
        <p><span class="goLine2">去</span><label>{{item.departureCityName}}-{{item.arriveCityName}}</label></p>
        <p class="goback2">{{item.airlineName}} {{item.flightNumber}}</p>
        <p class="goback2 backgo2">{{item.outTime}}<img src="../../static/imgs/singletrip.png" alt=""><label>{{item.arriveTime}}</label></p>
        <p class="goback2 golabel2">{{item.departureAirportName}}<label>{{item.airlineName}}</label></p>
      </div>
      <div v-for="item of obj5.back">
        <p><span class="backLine2">返</span><label>{{item.departureCityName}}-{{item.arriveCityName}}</label></p>
        <p class="goback2">{{item.airlineName}} {{item.flightNumber}}</p>
        <p class="goback2 backgo2">{{item.outTime}}<img src="../../static/imgs/singletrip.png" alt=""><label>{{item.arriveTime}}</label></p>
        <p class="goback2 golabel2">{{item.departureAirportName}}<label>{{item.airlineName}}</label></p>
      </div>
      <p class="lineDD2">
        注：以上航班信息仅供参考，以实际起飞时间为准；联运城市需缴纳少量联运费用，具体以询价为准。
      </p>
    </div>
    <div class="xiangLine2">
      <p><img src="../../static/imgs/shu2.png" alt="">详细行程</p>
      <div class="days2">
        <div v-for="(item,id) of obj2" v-if="id<num">
          <img src="../../static/imgs/riqi.png" alt="">
          <span>{{item.scheduleNo}}</span>
          <span v-for="(i,ind) of item.dayTrip"v-if="i=='TRA001'"><img src="../../static/imgs/art2.png" alt=""></span>
          <span v-else>{{i}}</span>
          <div class="wrapLine2">
            <p class="trans2" v-if="item.flightNo != ''"><img src="../../static/imgs/art2.png" alt="">交通</p>
            <p class="linenew2" >{{item.flightNo}}</p>
            <lines :obj="item"></lines>
            <p class="planLine2" v-if="obj.scheduleDes != ''"><img src="../../static/imgs/plan2.png" alt="">行程安排</p>
            <p class="linenew2" v-for="(i,j) of item.scheduleDes.split('\r\n')">{{i}}</p>
          </div>
        </div>
        <div class="lastChild2">
          <p @click="lastShow21()" v-if="bol">{{texts}}<img :src="imgurl" alt=""></p>
          <p @click="lastShow22()" v-else>{{texts}}<img :src="imgurl" alt=""></p>
        </div>
        <p class="tishi2">提示：不同出发日期，产品行程或略有不同，请以最终合同版行程为准。</p>
      </div>
    </div>

  </div>
</template>

<script>
import lines from '../components/lineNew.vue'
export default {
  props:['obj','obj5','obj2'],
  data(){
    return{
      texts:'展开全部行程',
      imgurl:"../../static/imgs/touDown2.png",
      num:3,
      bol:true
    }
  },
  components:{
    lines
  },
  methods:{
    lastShow21(){
      this.num=6;
      this.texts="收起全部行程";
      this.imgurl="../../static/imgs/touUp2.png";
      this.bol=false;
    },
    lastShow22(){
      this.num=3;
      this.texts="展开全部行程";
      this.imgurl="../../static/imgs/touDown2.png";
      this.bol=true;
    }
  }
}
</script>

<style lang="css">
.artLine2{
  width: 90%;
  margin: 0 auto;
  background: #fff;
  margin-top: 1rem;
  border-radius: 0.5rem;
  padding: 1.5rem 0.5rem;
}
.artLine2>p{
  font-size: 1.5rem;
}
.artLine2 img{
  vertical-align: middle;
  width: 6%;
}
.artLine2>p>i{
  float: right;
  border: 1px solid #0099a9;
  color: #0099a9;
  font-size: 1rem;
  border-radius: 0.3rem;
  padding: 0.1rem;
}
.days2>div>img{
  vertical-align: middle;
  margin-right: 1rem;
}
/*去*/
.goLine2{
  padding: 0.26rem;
  background: #ffaa01;
  color: #fff;
  font-size: 1.4rem;
  border-radius: 0.3rem;
  margin: 0 0.5rem;
}
/*回*/
.backLine2{
  padding: 0.26rem;
  background: #3988fe;
  color: #fff;
  font-size: 1.4rem;
  border-radius: 0.3rem;
  margin: 0 0.5rem;
}
.artLine2>div{
  font-size: 1.4rem;
  margin: 1rem 0;
}
.artLine2>div>p{
  margin-top: 0.5rem;
}
.goback2{
  font-size: 1.2rem;
  color: #666;
  margin-left: 9%;
}
.golabel2{
  font-size: 1rem;
}
.golabel2 label{
  float: right;
}
.backgo2{
  font-size: 1.8rem;
  color: #000;
}
.backgo2 img{
  width: 50%;
  height: 1rem;
  margin-left: 12%;
}
.backgo2 label{
  float: right;
}
.lineDD2{
  border-top: 1px dotted #999;
  padding: 1rem 0.5rem;
  padding-bottom: 0;
  color: #999;
  line-height: 2rem;
}
/*详细行程*/
.xiangLine2{
  margin-top: 1rem;
  background: #fff;
  padding-left: 1.5rem;
}
.planLine2 img,.trans2 img{
  vertical-align: bottom;
  width: 5%;
  margin-right: 0.6rem;
}
.trans2{
  margin-top: 1rem;
}
.linenew2{
  line-height: 2rem;
}
.wrapLine2{
  padding: 1rem;
  margin-right: 1.5rem;
  background: #f5f5f5;
}
.lastChild2{
  text-align: center;
  color: #ff6b01;
}
.lastChild2 p{
  border: 1px solid #ff6b01;
  display: inline-block;
  font-size: 1.6rem;
  padding: 0.4rem 0.6rem;
}
.lastChild2 img{
  vertical-align: bottom;
  width: 15%;
}
.tishi2{
  margin-right: 1.5rem;
  padding: 0.5rem 0 1.5rem 0;
  color: #999;
}
</style>
